<div class="market">
  <div class="collection-item" *ngFor="let collection of collectionList"
    [ngClass]="{ active: collection.collectionStatus === 5 }">
    <div class="item-title">
      <b>{{ collection.collectionName }}&emsp;·&emsp;{{collection.pictureName}}</b>
    </div>
    <img [src]="collection.url" class="big-img" alt="" />
    <div class="item-top">
      <div class="avatar">
        <img src="../../../assets/img/default.png" alt="" />
      </div>
      <span>{{ collection.issuer }}</span>
    </div>
    <hr style="margin: 0" />
    <div class="item-middle">
      <div style="max-width: 240px">
        <app-countdown *ngIf="collection.collectionStatus === 4" title="等待：" [enddate]="collection.saleTime"
          (callGetList)="callGetList()" type="collection"></app-countdown>
        <app-countdown *ngIf="collection.collectionStatus === 5" title="出售中：" [enddate]="collection.offShelfTime"
          (callGetList)="callGetList()" type="collection"></app-countdown>
        <div style="margin-left: -2px; position: absolute; bottom: 0">
          <b>￥{{ collection.price }}</b><span style="font-size: 12px; margin-left: 16px">{{ collection.remain }} / {{
            collection.supplies }}</span>
        </div>
      </div>
      <d-button class="apply" *ngIf="collection.collectionStatus === 5 && collection.remain" [bordered]="true"
        (click)="applyCollecti(collection)">立即抢购</d-button>
      <d-button *ngIf="collection.collectionStatus === 5 && collection.remain === 0" class="btn-disabled"
        [bordered]="true" [disabled]="true">已售罄</d-button>
      <d-button [bordered]="true" class="btn-disabled" *ngIf="collection.collectionStatus === 4" [disabled]="true">即将开售
      </d-button>
      <d-button [bordered]="true" class="btn-disabled" *ngIf="collection.collectionStatus === 6" [disabled]="true">已结束
      </d-button>
    </div>
  </div>
  <div class="bottom">
    <d-pagination style="position: absolute; right: 0; top: 20px" [total]="totalNum" [(pageSize)]="queryParams.pageSize"
      [(pageIndex)]="queryParams.page" [maxItems]="10" [canViewTotal]="true" [canJumpPage]="true"
      [canChangePageSize]="true" [autoFixPageIndex]="false" (pageIndexChange)="pageIndexChange($event)"
      (pageSizeChange)="pageSizeChange($event)">
    </d-pagination>
  </div>
</div>
